<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>Title</title>
	<script src="node_modules/axios/dist/axios.min.js"></script>
</head>
<body>
<button>A</button>
<button>B</button>
<div id="app"></div>
</body>
<script>
	const btns = document.querySelectorAll("button");
	const app = document.querySelector("#app");
	btns[0].onclick = async function(){
		const {data} = await axios.get("/maoyan");
		const t1 = Date.now();
		app.innerHTML = null;
		data.hot.forEach(item=>{
			app.innerHTML += (`
				<div>
					<img height="200" src="${item.img}" alt="">
					<p>${item.nm}</p>
					<hr/>
				</div>
			`);
		});
		console.log("A:",Date.now()-t1);
	}
	btns[1].onclick = async function(){
		const {data} = await axios.get("/maoyan");
		let t2 = Date.now();
		app.innerHTML = data.hot.map(item=>(`
			<div>
				<img height="200" src="${item.img}" alt="">
				<p>${item.nm}</p>
				<hr/>
			</div>
		`)).join("");
		console.log("B",Date.now()-t2);
	}
</script>
</html>